<!DOCTYPE html>
<html lang="zh-cn">

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width,initial-scale=1.0" />
  <link rel="stylesheet" href="/print/_css/charecipe.css" />
  <title>收费处方打印</title>
</head>

<body>
  <div id="app">
    <div v-for="(item,index) in list" class="significance-box">
      <div class="top-head">
        <div style="text-align: center;width:100%;" class="left">
          <img class="img-logo" :src="logo" alt="" />
          <span style="width:100%;text-align:center;display:inline-block;">{{hospitalName}}</span>
          <span>{{item.title}}</span>
        </div>
      </div>
      <div class="user-info">
        <table border="0" width="100%">
          <tr>
            <td>姓名：{{userInfo.name}}</td>
            <td>性别：{{userInfo.sex ==1?'男':(userInfo.sex ==2?'女':'不详')}}</td>
            <td>年龄：<span v-if="userInfo.age>17">{{userInfo.age}}岁</span><span v-else>{{userInfo.birthday|toAge}}</span>
            </td>
          </tr>
          <tr>
            <td>档案号：{{userInfo.archivesCode}}</td>
            <td>证件号：{{userInfo.idCard}}</td>
            <td v-if="orderCode!=''">流水单号：{{orderCode?orderCode:''}}</td>
          </tr>
          <tr>
            <td v-if="dept">收费科室：{{dept}}</td>
            <td v-if="doctor">收费医生：{{doctor}}</td>
          </tr>
        </table>
      </div>
      <div class="nr-box" style="border:0px;">
        <table border="0" width="100%" style="border-top: 0.1mm solid #101010;position: absolute;top:34mm;">
          <tr class="table-title thead_box">
            <td>项目</td>
            <td>原价</td>
            <td>优惠价</td>
            <td>数量</td>
            <td>总金额</td>
          </tr>
          <tr v-for="(item2,index2) in item.list" :key="index2" class="tr-item">
            <td>{{item2.sourceName}}</td>
            <td>￥{{item2.unitPrice}}元</td>
            <td>￥{{item2.actualAmount}}元</td>
            <td>{{item2.number}}</td>
            <td>
              ￥{{item2.actualAmount}}元
            </td>
          </tr>
        </table>
      </div>
      <table border="0" width="100%"
        style="margin-top:2mm;border-top: 0.1mm solid #101010;position:absolute;top:130mm;z-index: 222;">
        <tr class="thead_box">
          <td>应收金额：￥{{total}}元</td>
          <td v-for="(items,index) in billPayways" v-if="items.source==13 ">
            <span v-if="items.source ==13 ">
              减免金额：￥{{items.payMoney}}元
            </span>
          </td>
        </tr>
      </table>
    </div>
  </div>
  </div>
  <script src="https://lib.baomitu.com/vue/2.6.10/vue.min.js"></script>
  <script>
    new Vue({
      data: {
        list: [],
        hospital: {
          logo: "",
          name: ""
        },
        total: "",
        userInfo: {},
        logo: "",
        orderCode: "",
        doctor: "",
        dept: "",
        billPayways: [],
        disAmount: "",
        hospitalName: "",
        pageSize: 7, //每页打印数量
        discountEnum: []
      },
      filters: {
        toSex(value) {
          var str = "--";
          if (value == null) return str;
          return value == 1 ? "男" : "女";
        },
        changeSourceName(value) {
          var str = "";
          switch (value) {
            case 1:
              str = "医保支付";
              break;
            case 2:
              str = "挂账金额";
              break;
            case 3:
              str = "商保支付";
              break;
            case 4:
              str = "使用卡券";
              break;
            case 5:
              str = "余额支付";
              break;
            case 6:
              str = "积分";
              break;
            case 7:
              str = "现金";
              break;
            case 11:
              str = "找零";
              break;
          }
          return str;
        },
        toAge(birthday) {
          if (!birthday) return "";
          var now = new Date();
          var year = now.getFullYear();
          var month = now.getMonth() + 1;
          var day = now.getDate();
          var hour = now.getHours();
          var minute = now.getMinutes();
          var second = now.getSeconds();
          var myDate = new Date(birthday);
          var myYear = myDate.getFullYear();
          var myMonth = myDate.getMonth() + 1;
          var myDay = myDate.getDate();
          var myHour = myDate.getHours();
          var myMinute = myDate.getMinutes();
          var mySecond = myDate.getSeconds();
          var isLeapYear = function isLeapYear(year) {
            return (year % 4 == 0 && year % 100 != 0) || year % 400 == 0;
          };
          var getDaysOfMonth = function getDaysOfMonth(dateStr) {
            var date = new Date(dateStr);
            var year = date.getFullYear();
            var mouth = date.getMonth() + 1;
            var day = 0;

            if (mouth == 2) {
              day = isLeapYear(year) ? 29 : 28;
            } else if (
              mouth == 1 ||
              mouth == 3 ||
              mouth == 5 ||
              mouth == 7 ||
              mouth == 8 ||
              mouth == 10 ||
              mouth == 12
            ) {
              day = 31;
            } else {
              day = 30;
            }
            return day;
          };
          var gapSecond = second - mySecond;
          if (gapSecond < 0) {
            minute -= 1;
            gapSecond = 60 - mySecond + second;
          }
          var gapMinute = minute - myMinute;
          if (gapMinute < 0) {
            hour -= 1;
            gapMinute = 60 - myMinute + minute;
          }
          var gapHour = hour - myHour;
          if (gapHour < 0) {
            day -= 1;
            gapHour = 24 - myHour + hour;
          }
          var gapDay = day - myDay;
          if (gapDay < 0) {
            month -= 1;
            gapDay = getDaysOfMonth(birthday) - myDay + day;
          }
          var gapMonth = month - myMonth;
          if (gapMonth < 0) {
            year -= 1;
            gapMonth = 12 - myMonth + month;
          }
          var gapYear = year - myYear;
          if (gapYear < 0) {
            gapYear = 0;
          }
          var dateStr = `${gapYear}岁${gapMonth}月${gapDay}天`;
          return dateStr;
        }
      },
      mounted() {
        var th = this;
        window.addEventListener(
          "message",
          function (event) {
            var obj = JSON.parse(event.data.params);
            th.disAmount = obj.disAmount;
            th.total = obj.total;
            th.orderCode = obj.orderCode;
            th.billPayways = obj.billPayways;
            th.doctor = obj.doctor;
            th.special = obj.special;
            th.dept = obj.dept;
            th.userInfo = obj.detail;
            var lists = obj.list;
            var special = obj.special;
            th.logo = obj.logo;
            th.hospitalName = obj.hospitalName;
            var arr = [];
            var cfArr = [];
            var tsArr = [];
            var list = [];
            var sellMoney = 0;
            var disAllMoney = 0;
            var zlSellMoney = 0;
            var tsSellMoney = 0;
            var tsDisAllMoney = 0;
            var zlDisAllMoney = 0;
            var numIndex = 0;
            var title = "";
            //如果是7的倍数就第二页
            var objs = obj.list.filter((item, index) => {
              if (
                item.source == 4 ||
                item.source == 5 ||
                item.source == 3 ||
                item.source == 7 ||
                item.source == 1
              ) {
                return item;
              }
            });
            var items = obj.list.filter((item, index) => {
              if (
                item.source != 4 &&
                item.source != 5 &&
                item.source != 3 &&
                item.source != 7 &&
                item.source != 1
              ) {
                return item;
              }
            });
            objs.forEach((item, index) => {
              zlSellMoney = 0;
              if (item.realityMoney) {
                var priceDisplay = Number.parseFloat(item.realityMoney);
                zlSellMoney += priceDisplay;
                let realityM =
                  Number.parseFloat(item.totalPrice) -
                  Number.parseFloat(item.realityMoney);
                zlDisAllMoney += realityM.toFixed(2);
                item.allTotalPrice = zlSellMoney;
              } else {
                var priceDisplay = Number.parseFloat(item.totalPrice);
                zlSellMoney += priceDisplay;
                let realityM =
                  Number.parseFloat(item.totalPrice) -
                  Number.parseFloat(item.totalPrice);
                zlDisAllMoney += realityM.toFixed(2);
                item.allTotalPrice = zlSellMoney;
              }
              arr.push(item);
              var i = index + 1;
              if (i % th.pageSize == 0) {
                list.push({
                  sellMoney: zlSellMoney,
                  title: "诊疗收费清单",
                  disAllMoney: zlDisAllMoney,
                  list: arr
                });
                arr = [];
                zlSellMoney = 0;
                zlDisAllMoney = 0;
              }
            });
            items.forEach((item, index) => {
              disAllMoney = 0;
              if (item.realityMoney) {
                var priceDisplay = Number.parseFloat(item.realityMoney);
                sellMoney += priceDisplay;
                let realityM =
                  Number.parseFloat(item.totalPrice) -
                  Number.parseFloat(item.realityMoney);
                disAllMoney += realityM.toFixed(2);
                item.allTotalPrice = sellMoney;
              } else {
                var priceDisplay = Number.parseFloat(item.totalPrice);
                sellMoney += priceDisplay;
                let realityM =
                  Number.parseFloat(item.totalPrice) -
                  Number.parseFloat(item.totalPrice);
                disAllMoney += realityM.toFixed(2);
                item.allTotalPrice = sellMoney;
              }
              cfArr.push(item);
              if ((index + 1) % th.pageSize == 0) {
                list.push({
                  sellMoney: sellMoney,
                  title: "处方收费清单",
                  disAllMoney: disAllMoney,
                  list: cfArr
                });

                cfArr = [];
                sellMoney = 0;
                disAllMoney = 0;
              }
            });

            special.forEach((item, index) => {
              tsSellMoney = 0;
              if (item.realityMoney) {
                var priceDisplay = Number.parseFloat(item.realityMoney);
                tsSellMoney += priceDisplay;
                let realityM =
                  Number.parseFloat(item.totalPrice) -
                  Number.parseFloat(item.realityMoney);
                tsDisAllMoney += realityM.toFixed(2);
                item.allTotalPrice = tsSellMoney;
              } else {
                var priceDisplay = Number.parseFloat(item.totalPrice);
                tsSellMoney += priceDisplay;
                let realityM =
                  Number.parseFloat(item.totalPrice) -
                  Number.parseFloat(item.totalPrice);
                tsDisAllMoney += realityM.toFixed(2);
                item.allTotalPrice = tsSellMoney;
              }
              tsArr.push(item);
              var i = index + 1;
              if (i % th.pageSize == 0) {
                list.push({
                  sellMoney: tsSellMoney,
                  title: "特殊收费清单",
                  disAllMoney: tsDisAllMoney,
                  list: tsArr
                });
                tsArr = [];
                tsSellMoney = 0;
                tsDisAllMoney = 0;
              }
            });
            //特殊收费
            if (arr.length > 0) {
              list.push({
                sellMoney: zlSellMoney,
                title: "诊疗收费清单",
                list: arr,
                disAllMoney: zlDisAllMoney
              });
            }
            if (cfArr.length > 0) {
              list.push({
                sellMoney: cfArr[0].allTotalPrice,
                title: "处方收费清单",
                list: cfArr,
                disAllMoney: disAllMoney
              });
            }
            if (special.length > 0) {
              list.push({
                sellMoney: tsArr[0].allTotalPrice,
                title: "特殊收费清单",
                list: tsArr,
                disAllMoney: tsDisAllMoney
              });
            }
            th.list = [...list];
            //这里要判断图片是否加载完成
            var imgs = document.querySelectorAll("img-erweima");
            var timer = setInterval(() => {
              clearInterval(timer);
              window.print();
            }, 1000);
          },
          false
        );
      },
      methods: {},
      watch: {},
      filters: {}
    }).$mount("#app");
  </script>
</body>

</html>